<template>
<div>
  <el-button type="text" @click="jump">弹出框1</el-button>
  <el-button type="button" @click="choose">弹出框2</el-button>
  <el-button type="button" @click="ll">支持HTML</el-button>

  <p>{{tips}}</p>
</div>
</template>

<script>
export default {
    data(){
        return {
            tips:'窗口被关闭后，会默认返回一个Promise对象便于进行后续操作的处理。'
        }
    },
    methods:{
        jump(){
            this.$alert('helloworld','Title',{
                confirmButtonText:'不确定',
                callback:action =>{
                    this.$message({
                        type:'info',
                        message:`action:${action}`
                    })
                }
            })
        },
        choose(){
            this.$confirm('点击是否删除文件','取消与确定',{
                confirmButtonText:'删除',
                cancelButtonText:'取消',
                type:'warning'
            }).then(()=>{
                this.$message({
                    type:'success',
                    message:'删除成功！'
                });
            }).catch(()=>{
                this.$message({
                    type:'info',
                    message:'已取消删除。'
                })
            })
        },
        ll(){
            this.$alert('<b>加粗</b><i>斜体</i>','支持HTML片段',{
                dangerouslyUseHTMLString:true
            })
        }
    }
}
</script>

<style scoped>

</style>